<script>
import { baseImgUrl } from '@/utils/http'

export default {
  name: 'travel-detail-banner',
  props: {
    picture: String,
    banners: Array
  },
  computed: {
    imgUrl() {
      return this.picture ? `${baseImgUrl}${this.picture}` : ''
    }
  }
}
</script>

<template>
  <swiper class="travel-detail-banner" circular autoplay>
    <!-- <block v-if="banners" v-for="(b,i) in banners" :key="i">
      <swiper-item class="banner-item">
        <img :src="b" class="item-img" mode="aspectFill">
      </swiper-item>
    </block> -->

    <!-- 如果只有单张图片 -->
    <swiper-item class="banner-item">
      <img :src="imgUrl" class="item-img" mode="aspectFill">
    </swiper-item>
  </swiper>
</template>

<style lang="scss" scoped>
.travel-detail-banner {
  height: 400rpx;
  .item-img {
    width: 100%;
    height: 100%;
  }
}
</style>
